<%@page import="java.util.*,hyper.market.beans.*,java.io.*"%>
<%@page contentType="text/html"%>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<jsp:useBean id="notilist" class="java.util.ArrayList" scope="session"/>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Home</title>
        <link rel="stylesheet" href="style/desk.css" type="text/css" />
        <link rel="stylesheet" href="TinyAccordion/style.css"/>
        <link rel="stylesheet" href="style/960.css" type="text/css" />
        <link rel="stylesheet" href="style/960_12_col.css" type="text/css" />
        <script src="scripts/jquery-1.6.4.min.js"></script>
        <script type = "text/javascript">
            var modalWindow = {
                parent:"body",
                windowId:null,
                content:null,
                width:null,
                height:null,
                close:function()
                {
                    $(".modal-window").remove();
                    $(".modal-overlay").remove();
                },
                open:function()
                {
                    var modal = "";
                    modal += "<div class=\"modal-overlay\"></div>";
                    modal += "<div id=\"" + this.windowId + "\" class=\"modal-window\" style=\"width:" + this.width + "px; height:" + this.height + "px; margin-top:-" + (this.height / 2) + "px; margin-left:-" + (this.width / 2) + "px;\">";
                    modal += this.content;
                    modal += "</div>";

                    $(this.parent).append(modal);

                    $(".modal-window").append("<a class=\"close-window\"></a>");
                    $(".close-window").click(function(){modalWindow.close();});
                    $(".modal-overlay").click(function(){modalWindow.close();});
                }
            };
            var openMyModal = function(source)
            {
                modalWindow.windowId = "myModal";
                modalWindow.width = 600;
                modalWindow.height = 600;
                modalWindow.content = "<iframe width='600' height='600' frameborder='0' scrolling='yes' allowtransparency='true' src='" + source + "'></iframe>";
                modalWindow.open();
            };
             var openMyModal2 = function(source)
            {
                modalWindow.windowId = "myModal2";
                modalWindow.width = 480;
                modalWindow.height = 300;
                modalWindow.content = "<iframe width='480' height='300' frameborder='0' scrolling='no' allowtransparency='true' src='" + source + "'></iframe>";
                modalWindow.open();
            };
            var openMyModal3 = function(source)
            {
                modalWindow.windowId = "myModal3";
                modalWindow.width = 500;
                modalWindow.height = 300;
                modalWindow.content = "<iframe width='500' height='300' frameborder='0' scrolling='no' allowtransparency='true' src='" + source + "'></iframe>";
                modalWindow.open();
            };
            function commitedActions(k){
                document.getElementById("Vimg"+k).style.display = 'block';
            }

            function initRequest() {
                if (window.XMLHttpRequest) {
                    return new XMLHttpRequest();
                } else if (window.ActiveXObject) {
                    isIE = true;
                    return new ActiveXObject("Microsoft.XMLHTTP");
                }
            }

            function commitNotification(nid,selectIndex) {
                var url = "/HyperMarket/NotificationViewAcceptServlet?nid="+nid;
                var req = initRequest();
                req.onreadystatechange = function() {
                    if (req.readyState == 4) {
                        if (req.status == 200) {
                            parseMessages(req.responseXML,selectIndex);
                        } else if (req.status == 204){
                            alert('Theres something wrong with the connection, try again =)');
                        }
                    }
                };
                req.open("POST", url, true);
                req.send(null);
            }


            function parseMessages(responseXML,k) {

                var commitAction = responseXML.getElementsByTagName("valid")[0];
                var success =  commitAction.childNodes[0].nodeValue;
                if(success){
                    commitedActions(k);
                }else{
                    alert('Theres something wrong with the connection, try again =)');
                }

            }

        </script>
    </head>
    <body>
        <div class="header group">
            <div class="pagewidth">

                <ul class="headernav">
                    <li><a href="/HyperMarket/ManagerViewStoresServlet"><img class="headerlogo" src="./arts/logo.png" width="106" height="22" alt="Bagcheck Home" border="0" /></a></li>
                    <li class="headerlink headerlinkhl"><a p='header' t='home' href="#" onclick="return false;">Home</a></li>
                    <li class="headerlink "><a p='header'  href="/HyperMarket/ViewStockServlet" onclick="openMyModal('/HyperMarket/ViewStockServlet');return false;">View Stocks</a></li>
                    <li class="headerlink "><a p='header'  href="/HyperMarket/ViewStaffServlet" onclick="openMyModal2('/HyperMarket/ViewStaffServlet');return false;">View Staffs</a></li>
                    <li class="headerlink "><a p='header'  href="/HyperMarket/RequestReportServlet" onclick="openMyModal3('/HyperMarket/RequestReportServlet');return false;">Request Report</a></li>
                    <li class="headerlink "><a p='header'  href="/HyperMarket/LogoutServlet">Logout</a></li>

                </ul>
            </div>
        </div>

        <div class="container_12">
            <div class="suffix_12">
            &nbsp;</div><br>
            <br>
            <div id="notifList" class="grid_6">
                <ul class="acc " id="acc">
                    <%
                                int rowcounter = 1;
                                out.println("<li><h3>Notification</h3><div class=\"acc-section\"> <div class=\"acc-content\"><table id='ManagerNotiTable' name='ManagerNotiTable' cellspacing='10'>");  // create a new nest of list;
                                for (int i = 0; i < notilist.size(); i++) {
                                    out.println("<tr><td cellpadding='5px'>" + rowcounter + " </td>");
                                    rowcounter++;
                                    // creating ONE node
                                    out.println("<td style='width:auto'>" + ((NotificationBean) notilist.get(i)).getDesc() + "</td>");
                                    out.println("<td>" + ((NotificationBean) notilist.get(i)).getStaffName() + "</td>");
                                    out.println("<td>" + ((NotificationBean) notilist.get(i)).getCreatedDate() + "</td>");
                                    // 1 - order more, discontinue , OUT of Stock / Low in Stock (view) (Order More) <dropdown> (discontinue)
                                    // 2 - edit item , requesting more discount (View) (Link)
                                    // 3 - acknowledge of expiredGoods (View) ( Okay)
                                    switch (((NotificationBean) notilist.get(i)).getAction()) {
                                        // View Accept Request - done
                                        case 4:
                                            out.println("<td><a href=\"#\" onclick=\"commitNotification('"+((NotificationBean) notilist.get(i)).getNotificationid() +"','"+i+"');return false;\" >Accept</a></td>");
                                            out.println("<td><img id=\"Vimg" + i + "\" style='display:none;' src='./images/verify_icon.gif'></td></tr>");
                                            break;
                                        //View Cost Updates Report- Done
                                        case 5:
                                            out.println("<td><a href=\"/HyperMarket/NotificationReportServlet?nid=" + ((NotificationBean) notilist.get(i)).getNotificationid() + "&storename=" + ((NotificationBean) notilist.get(i)).getStoreName() + "\" target=\"_blank\" onclick=\"commitedActions(" + i + ");openMyModal('/HyperMarket/NotificationReportServlet?nid=" + ((NotificationBean) notilist.get(i)).getNotificationid() + "&storename=" + ((NotificationBean) notilist.get(i)).getStoreName() + "');return false;\" >Report</a></td>");
                                            out.println("<td><img id=\"Vimg" + i + "\" style='display:none;' src='./images/verify_icon.gif'></td></tr>");
                                            break;
                                        // View Expiry Goods
                                        case 6:
                                            out.println("<td><a href=\"/HyperMarket/NotificationExpiryServlet?stockid=" + ((NotificationBean) notilist.get(i)).getStockdetailid() + "&nid=" + ((NotificationBean) notilist.get(i)).getNotificationid() + "&storename=" + ((NotificationBean) notilist.get(i)).getStoreName() + "\" target=\"_blank\" onclick=\"commitedActions(" + i + ");openMyModal('/HyperMarket/NotificationExpiryServlet?stockid=" + ((NotificationBean) notilist.get(i)).getStockdetailid() + "&nid=" + ((NotificationBean) notilist.get(i)).getNotificationid() + "&storename=" + ((NotificationBean) notilist.get(i)).getStoreName() + "');return false;\" >View</a></td>");
                                            out.println("<td><img id=\"Vimg" + i + "\" style='display:none;' src='./images/verify_icon.gif'></td></tr>");
                                            break;
                                    }

                                }
                                out.println("   </table></div></div></li>");
                    %>

                </ul>
            </div>
            <div class="grid_6">
                <table cellspacing="24">
                    <tr>
                        <td>
                            <button class="ovaction ovactionbig ovactionprimary" style="text-align: center; margin: 5px 10px 0 -1px; width:173px" onclick="openMyModal2('/HyperMarket/ViewStaffServlet');return false;">View Staff</button>
                        </td>
                    </tr>
                    <tr>
                    </tr>
                    <tr>
                        <td>
                            <button class="ovaction ovactionbig ovactionprimary" style="text-align: center; margin: 5px 10px 0 -1px; width:173px" onclick="openMyModal('/HyperMarket/ViewStockServlet');return false;">View Stores Stock</button>
                        </td>
                    </tr>
                    <tr>
                    </tr>
                    <tr>
                        <td>
                            <button class="ovaction ovactionbig ovactionprimary2" style="text-align: center; margin: 5px 10px 0 -1px; width:173px" onclick="openMyModal3('/HyperMarket/RequestReportServlet');return false;">Request Report</button>
                        </td>
                    </tr>
                </table>
            </div>

        </div>
        <script type="text/javascript" src="./TinyAccordion/script.js"></script>
        <script type="text/javascript">

            var parentAccordion=new TINY.accordion.slider("parentAccordion");
            parentAccordion.init("acc","h3",-1,-1);

            var nestedAccordion=new TINY.accordion.slider("nestedAccordion");
            nestedAccordion.init("nested","h3",1,-1,"acc-selected");

        </script>
    </body>
</html>
